import React,{useState,useEffect} from 'react';
import {Button, Select, Space, Table} from "antd";
import Axios from "../../util/axios"
const { Option } = Select;
function TabFoundSet(props) {
    const [dataSource,setdataSource] =useState([]);
    const columns = [
        {
            title: '序号',
            dataIndex: 'stoneId',
            key: 'stoneId'
        },
        {
            title: '成色编码',
            dataIndex: 'colorCoding',
            key: 'colorCoding'
        },
        {
            title: '成色名称',
            dataIndex: 'colorName',
            key: 'colorName'
        },
        {
            title: '重量单位',
            dataIndex: 'weightUnit',
            key: 'weightUnit'
        },

        {
            title: '成分比例',
            dataIndex: 'compProportion',
            key: 'compProportion'
        },

        {
            title: '成色类别',
            dataIndex: 'colorCategory',
            key: 'colorCategory'
        },

        {
            title: '千足料名称',
            dataIndex: 'materiName',
            key: 'materiName'
        },

        {
            title: '操作',
            dataIndex: 'action',
            key: 'action',
            align:'center',
            render: ()=>{
                return(
                    <Space>
                        <Button size="small" type="primary" >编辑</Button>
                        <Button  size="small" type="danger">删除</Button>
                    </Space>
                )
            }
        }
    ];
    useEffect(() =>{
        Axios.get("/productFoundSet").then((res) =>{
            setdataSource(res.data.data)
        })
    },[]);


    return (
        <div>
            <div>
                <ul className="selectStone">
                    <li>选择修改种类</li>
                    <li>
                        <Select defaultValue="type" style={{ width: 120 }}>
                            <Option value="type">成色设置</Option>
                            <Option value="color">属性设置</Option>
                            <Option value="Cleanliness">款式分类设置</Option>
                            <Option value="cut">商品种类类型设置</Option>
                            <Option value="fireColor">含金量设置</Option>
                            <Option value="shape">回收就材料名称设置</Option>
                        </Select>
                    </li>
                </ul>
                <Table
                    rowSelection={{
                        type: 'checkbox'
                    }}
                    dataSource={dataSource}
                    columns={columns}
                    pagination={{pageSize:3}}
                    scroll={{y:240}}
                    rowKey="stoneId"
                />

            </div>
        </div>
    );
}

export default TabFoundSet;